<template>
	<view class="punch_in_details">
			<view class="detailsBox_body">
				<view class="de_li">
					<view class="de_li_title">交易哈希</view>
					<view class="de_li_content">
						<text>{{data.voucher}}</text>
						<image src="/static/my/copy01.png" mode="widthFix" @click="copy(data.voucher)"></image>
					</view>
				</view>
				<view class="de_li">
					<view class="de_li_title">购买者</view>
					<view class="de_li_content">
						<text>{{data.address}}</text>
						<image src="/static/my/copy01.png" mode="widthFix" @click="copy(data.address)"></image>
					</view>
				</view>
				<view class="de_li center">
					<view class="de_li_title">发行方</view>
					<view class="de_li_content">{{data.name}}</view>
				</view>
				<view class="de_li center">
					<view class="de_li_title">发行时间</view>
					<view class="de_li_content">{{data.issueTime}}</view>
				</view>
				<view class="de_li center">
					<view class="de_li_title">购卡时间</view>
					<view class="de_li_content">{{data.holdTime}}</view>
				</view>
				<view class="de_li center">
					<view class="de_li_title">上链时间</view>
					<view class="de_li_content">{{data.chainTime}}</view>
				</view>
			</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				id:'',
				data:{}
			}
		},
		onLoad(e) {
			this.id = e.id
			this.getChainDetail()
		},
		methods: {
			async getChainDetail(id) {
				var res = await this.$api.getChainDetail(this.id)
				this.data = res.result
				console.log(this.detailsData)
			},
			copy(text){
				if(text != ''){
					var _this = this
					 _this.$copyText(text).then(
                        res => {
                          uni.showToast({
                            title: '复制成功',
                            icon: 'none'
                          })
                        }
                      )
				}
			}
		}
	}
</script>

<style scoped>
	page{
		background: #F8FBFF;
	}
	.punch_in_details{
		padding-top: 46rpx;
	}
	.detailsBox_body{
		width: 686rpx;
		margin: 0 auto;
		background: #FFFFFF;
		box-shadow: 4rpx 8rpx 16rpx #F3F3F3;
		border-radius: 32rpx;
		box-sizing: border-box;
		padding: 0 24rpx 0 24rpx;
	}
	.de_li{
		width: 100%;
		box-sizing: border-box;
		padding: 24rpx 0 16rpx 0;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		font-size: 28rpx;
		color: #000000;
		border-bottom: 1rpx solid #EDEDED;
	}
	.de_li .de_li_title{
		width: 132rpx;
		font-weight: 600;
		font-size: 28rpx;
	}
	.de_li:last-child{
		border-bottom:unset;
	}
	.de_li_content{
		width: 490rpx;
		word-wrap:break-word;
		line-height: 42rpx;
	}
	.de_li_content image{
		width: 32rpx;
		height: 30rpx;
		float: right;
		margin-right: 14rpx;
	}
	.center{
		align-items: center;
	}
</style>
